// 1-导入vuex
import Vue from 'vue'
import Vuex from 'vuex'
// 导入http工具包
import axios from '../utils/http'
// 2-注册
Vue.use(Vuex)
// 3-创建数据存储对象
const store = new Vuex.Store({
  // 存储状态数据
  state: {
    brandList: []
  },
  // 定义数据操作方法
  mutations: {
    // 品牌列表初始化, 品牌列表数组
    brandInit(state,data) {
      state.brandList = data
    },
    // state: 系统自动注入, 代表的就是state数据存储对象
    brandAdd(state, name) {
      const id = state.brandList[0] ? state.brandList[0].id + 1 : 1
      const obj = {
        id,
        name,
        ctime: new Date().toLocaleDateString()
      }
      // 在品牌列表数组开头追加一个品牌对象
      state.brandList.unshift(obj)
    },
    //删除品牌
    brandDel(state, id) {
      // 通过id查找数组元素的索引
      const index = state.brandList.findIndex(item => item.id === id)
      // 执行数组删除
      state.brandList.splice(index, 1)
    },
    // 品牌更新 obj={id,name}
    brandUpdate(state, obj) {
      // 通过id查找数组元素的索引
      const index = state.brandList.findIndex(item => item.id === obj.id)
      // 更新品牌名称
      state.brandList[index].name = obj.name
      // 更新添加时间
      state.brandList[index].ctime = new Date().toLocaleDateString()
    }
  },
//   异步方法: 发数据请求
  actions:{
    //  请求品牌列表
    // conext: 上下文对象, 自动注入的系统参数
     getBrandList(conext){
        //  console.log(conext)
        axios.get('/brand').then(res=>{
            // 通过commit()触发mutations方法
            if(res.status===0){
                conext.commit('brandInit',res.message)
            }
        })
     },
    // 删除品牌
    delBrand({commit},id){
        // 删除远程数据
        axios.delete(`/brand/${id}`).then(res=>{
            if(res.status===0){
                // 删除本地数据
                commit('brandDel',id)
            }
        })
    },
    // 添加品牌
    addBrand({commit},name){
        // 给远程数据库添加品牌数据
        axios.post('/brand',{name}).then(res=>{
            if(res.status===0){
                // 给本地品牌列表数组中增加一条品牌信息
                commit('brandAdd',name)
            }
        })
    },
    // 品牌更新
    updateBrand({commit},obj){
        axios.put(`/brand/${obj.id}`,{name:obj.name}).then(res=>{
            if(res.status===0){
                // 更新本地数据
                commit('brandUpdate',obj)
            }
        })
    }
  },
 // 类似组件中的计算属性   
  getters:{
    // 计算品牌的数量  
    brandCount(state){
        return state.brandList.length
    }
  } 
})
// 4-导出
export default store
